<template>
  <div class="app-container">
    <el-form ref="form" :model="ScheduledAdd" :rules="rules" label-width="120px">
      <el-form-item label="任务key值:" prop="taskKey">
          <el-input v-model="ScheduledAdd.taskKey" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="任务名称:"  prop="name">
          <el-input v-model="ScheduledAdd.name" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="任务表达式:"  prop="cron">
          <el-input v-model="ScheduledAdd.cron" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="参数"  prop="collectionId">
          <el-input v-model="ScheduledAdd.collectionId" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">{{messageView.sumit}}</el-button>
        <el-button @click="onCancel">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
  
  <script>
  import {
    scheduledAddPost,
    scheduledUpdatePut,
    getDetail
  } from '@/api/automation/scheduled'
  export default {
    name: "scheduledFrom",
    data() {
      return {
        isAdd: true,
        isAddMessage: { sumit: "新增" },
        noAddMessage: { sumit: "编辑" },
        messageView: {},
        ScheduledAdd: {},
        id:"",
        taskKey: "",
        name: "",
        cron: "",
        collectionId: "",
        rules: {
          taskKey: [
            { required: true, message: "请输入任务key值", trigger: "blur" },
          ],
          name: [
            { required: true, message: "请输入任务名称", trigger: "blur" },
          ],
          cron: [
            { required: true, message: "请输入任务表达式", trigger: "blur" },
          ],
          collectionId: [
            { required: true, message: "请输入参数", trigger: "blur" },
          ]
        }
      };
    },
    methods: {
      onSubmit() {
        this.$refs.form.validate((valid) => {
          if (valid) {
            if (this.isAdd) {
              scheduledAddPost(this.ScheduledAdd).then(resp=>{
                this.$message({
                          message: resp.msg,
                          type: 'success'
                        });
                  this.$router.push("/automation/scheduled");        
              })
            } else {
              this.scheduledUpdateTrue();
            }
          } else {
            console.log("error submit!!");
            return false;
          }
        });
      },
      onCancel() {
        this.ScheduledAdd = {};
        this.$router.push("/automation/scheduled");
      },
      detail(id){
        getDetail(id).then(resp=>{
          this.ScheduledAdd=resp.data;
          if(this.ScheduledAdd.status=="禁用"){
            this.ScheduledAdd.status=0
          }else{
            this.ScheduledAdd.status=1
          }
        })
      },
      scheduledUpdateTrue(){
        this.ScheduledAdd.status=0;
        scheduledUpdatePut(this.ScheduledAdd).then(resp=>{
            this.$message({
                      message: resp.msg,
                      type: 'success'
                    });
            this.$router.push("/automation/scheduled");        
        })
      }
      // ConfigurationUpdate(){
      //   putAxios(this.connectionConfigurationAdd).then(resp=>{
      //       this.$message({
      //                 message: resp.msg,
      //                 type: 'success'
      //               });
      //       this.$router.push("/environment/connectionConfiguration");        
      //   })
      // },
    },
    created() {
      this.$router.onReady(() => {
        this.isAdd = this.$route.query.isAdd;
        this.id = this.$route.query.id;
      });
      if (this.isAdd) {
        this.messageView = this.isAddMessage;
      } else {
        this.messageView = this.noAddMessage;
        this.detail(this.id);
      }
    },
  };
</script>
  
  <style scoped>
.line {
  text-align: center;
}
</style>
  
  